<template>
  <div>{{ count }}</div>
  <button @click="count++">点我就加1</button>
  <button @click="add">点我就加10</button>
</template>
<script>
// setup中数据默认不是响应式的
import {  ref } from 'vue'

export default {
  // vue3 compositionApi代码的起点
  setup (){

    // 计数器
    const count = ref(0)
    console.log(count);
    // ref返回对象类型的数据记住也要用.value获取对象
    const obj = ref({
      name: '老韩',
      age: 18
    })
    console.log(obj.value.name)
    // ref返回的数据在js中使用需要用.value获取值
    const add = () => {
      count.value += 10
    }
    return {
      count,
      add
    }
  }
}

</script>